<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh-CN" lang="zh-CN">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<title>model</title>
	<meta http-equiv="Content-language" content="zh-CN" />
	<style type="text/css" media="all">
		* {font-size:24px; font-family:宋休;}
		#page {max-height:420px;border:1px solid gold;overflow:auto;}
	</style>
</head>
<body>
<div id="page">
</div><!-- #page end! -->
<div id="page2">
	<div>
		开始值: <input type="text" value="0" id="init" style="width:100px;" />
		个数: <input type="text" value="100" id="count" style="width:100px;" />
		<a href="javascript:;" id="prev">prev</a>
		<a href="javascript:;" id="next">next</a>
	</div>
	<div id="content">
	</div>
</div>
<script type="text/javascript">
//<![CDATA[
var chars = [
	171, 174, 175, 176, 177, 178, 179, 187,
	188, 1757, 1758, 1769, 2039,
	5099, 8413, 8414, 8415, 8416,
	5792, 9650, 10052,
	10697,
	8592, 8593, 8594, 8595, 8596, 8597, 8598, 8599, 8600,
	8804, 8805, 8806, 8807, 8808, 8809, 8810,
	8834, 8835, 8836, 8837, 8838, 8839, 8840, 8841, 8842, 8843,
	8998, 8999, 9000, 9003, 9004,
	9312, 9641, 9734, 9742, 9760, 9785, 9748, 9762, 9785,
	9873, 9851, 9873, 9878, 9835,
	9998, 9997, 10004, 10070, 10063, 10102, 10166,
	10227, 10554, 12942, 13223,
	128197, 128276, 128247, 128295, 128204, 128206, 128293, 128274, 128278
];
chars.sort(function(x, y){
	if(x>y)return 1;
	if(x<y)return -1;
	return 0;
});
var page = document.getElementById('page');
var ss = '';
for(var one in chars){
	ss += chars[one]+':&#'+chars[one]+'; ';
}
page.innerHTML = ss;

var content = document.getElementById('content');
var str_pad = function(nu, len, chr, lr){
	return (nu=[String(nu), ''])[+!(lr=+(lr=='r'))]
		+ new Array(((len=((len||2)+1-nu[0].length))>0)?len:0).join(chr||' ')
		+ nu[lr];
};
var get_chars = function(){
	var chars = '';
	var init = Number(document.getElementById('init').value);
	var count = Number(document.getElementById('count').value);
	for(var i = init+1; i <init+count+1; i++){
		chars += '<a style="display:inline-block">' + str_pad(i, Number(init+count+1).toString().length, '&nbsp;') + ':<span style="display:inline-block;width:20px;height:28px;line-height:28px;color:green;">&#' + i + ';</span></a> ';
	}
	content.innerHTML = chars;
};
get_chars();

document.getElementById('prev').onclick = function(){
	document.getElementById('init').value = Number(document.getElementById('init').value)
		- Number(document.getElementById('count').value);
	get_chars();
};
document.getElementById('next').onclick = function(){
	document.getElementById('init').value = Number(document.getElementById('init').value)
		+ Number(document.getElementById('count').value);
	get_chars();
};

//]]>
</script>
</body>
</html>
